<template>
	<view class="create">
		<view class="formsBox">
			<uni-forms ref="form" :modelValue="formData" :label-width="100" :rules="rules" label-position="top">
				<uni-forms-item label="申请人" name="applicant">
					<uni-easyinput type="text" v-model="formData.applicant" placeholder="请输入申请人" disabled />
				</uni-forms-item>
				<uni-forms-item label="申请时间" name="createDate">
					<uni-datetime-picker :disabled="!!processId" type="date" v-model="formData.createDate" @change="createDateChange" return-type="timestamp" placeholder="请选择申请时间" />
				</uni-forms-item>
				<uni-forms-item label="申请理由" name="remark">
					<uni-easyinput :disabled="!!processId" type="textarea" autoHeight v-model="formData.remark" placeholder="请输入申请理由"></uni-easyinput>
				</uni-forms-item>
				<uni-forms-item label="申请类型" name="type">
					<uni-data-select
						:disabled="!!processId"
					    v-model="formData.type"
					    :localdata="documentType"
						placeholder="请选择申请类型"
						@change="typeChange"
					></uni-data-select>
				</uni-forms-item>
				<uni-forms-item label="年号" name="year">
					<uni-easyinput :disabled="!!processId" type="text" v-model="formData.year" placeholder="请输入年号" />
				</uni-forms-item>
				<uni-forms-item :label="formData.type == 1 ? '文号' : '函号'" name="mark">
					<!-- <uni-easyinput :disabled="!!processId" type="text" v-model="formData.mark" :placeholder="'请输入'+(formData.type == 1 ? '文号' : '函号')" /> -->
					<!-- <uni-data-select
						:disabled="!!processId"
					    v-model="formData.type"
					    :localdata="documentType"
						placeholder="请选择申请类型"
						@change="typeChange"
					></uni-data-select> -->
					<u-button v-if="!formData.mark" size="small" style="width: 200rpx;margin: 0;" @click="selectWenHao">选择文号</u-button>
					<text v-else>{{formData.mark}}</text>
				</uni-forms-item>
				<uni-forms-item label="内容" name="content" >
					<sp-editor v-model="formData.content" @input="inputOver" ref="editor"></sp-editor>
				</uni-forms-item>
			</uni-forms>
		</view>
		<view class="buttonBox" v-if="!processId">
			<button class="button" @click="submit" type="primary">提交</button>
		</view>
		
		<!-- 弹出选择 -->
		<u-popup :show="show" closeOnClickOverlay @close="close">
			<view class="lineCon">
				<block v-if="wenHaoList.length > 0">
					<view class="itemLine" v-for="item in wenHaoList" :key="item.id">
						<view class="info">
							<view class="yy">
								<text class="tip">申请人:</text>
								<text>{{item.applicant}}</text>
							</view>
							<view class="yy">
								<text class="tip">申请科室:</text>
								{{item.deptName}}
							</view>
							<view class="yy">
								<text class="tip">年份:</text>
								{{item.year}}
							</view>
							<view class="yy">
								<text class="tip">文号:</text>
								{{item.num}}
							</view>
							<view class="yy">
								<text class="tip">发文标题:</text>
								{{item.title}}
							</view>
						</view>
						<view class="status">
							<u-button type="primary" :plain="true" text="选择" size="mini" @click="clickBtn(item)"></u-button>
						</view>
					</view>
				</block>
				<block v-else>
					<u-empty
						mode="data"
					>
					</u-empty>
				</block>
			</view>
		</u-popup>
	</view>
</template>

<script>
	// import {createLeave} from '@/api/oa/leave/index.js'
	
	// import {useVacation} from '@/api/user/userApi.js'
	import {createOaSendDocuments,getDocumentNumber} from '@/api/oa/sendDocuments/index.js'
	import {getOaApplicationNumberList} from '@/api/oa/applicationNumber/index.js'
	export default {
		props:{
			processId:'',
			propFromData:{},
			// remainingNum:0,
		},
		watch:{
			propFromData(val){
				this.formData = val;
				const regex = /\d{4}年\d{2}月\d{2}日/
				let dates= this.formData.stalker.match(regex)[0];
				// 将日期字符串转换为标准格式（YYYY-MM-DD）
				const parts = dates.split(/[年月日]/); // 使用正则表达式分割
				const year = parseInt(parts[0], 10);
				const month = parseInt(parts[1], 10) - 1; // 月份从 0 开始
				const day = parseInt(parts[2], 10);
				// 创建 Date 对象
				const date = new Date(year, month, day);
				// 获取时间戳
				this.formData.createDate = date.getTime();
				console.log(this.$refs.editor)
				this.$refs.editor.setEditorContent(this.formData.content)
			},
			// remainingNum(val){
			// 	this.remaining = val;
			// }
		},
		data() {
			return {
				formData:{
					applicant:this.$store.state.user.name,
					createDate:'',
					remark:'',
					type:1,
					year:'',
					mark:'',
					content:'',
					stalker:'',
					title:'太原市杏花岭区疾病预防控制中心文件',
					oaApplicationNumberId:''
				},
				documentType: [
					{
						value:1, text: "发文"
					},
					{
						value:2, text: "发函"
					}
				],
				// remaining:0,
				rules: {
					applicant: {
						rules: [{
							required: true,
							errorMessage: '请输入请假申请人',
						}]
					},
					
					createDate: {
						rules: [{
							required: true,
							errorMessage: '请选择申请时间',
						}]
					},
					remark:{
						rules: [{
							required: true,
							errorMessage: '请输入申请理由',
						}]
					},
					type: {
						rules: [{
							required: true,
							errorMessage: '请选择申请类型',
						}]
					},
					
					year: {
						rules: [{
							required: true,
							errorMessage: '请输入年号',
						}]
					},
					
					mark: {
						rules: [{
							required: true,
							errorMessage: '请输入文号',
						}]
					},
					content: {
						rules: [{
							required: true,
							errorMessage: '请输入内容',
						}]
					},
				},
				// 文号列表弹框
				show:false,
				// 文号列表
				wenHaoList:[]
			};
		},
		methods:{
			// 点击提交
			submit(){
				uni.showLoading()
				this.$refs.form.validate().then(async res => {
					try{
						if(this.formData.type == 1){
							// 发文
							this.formData.documentNumber = '杏疾控〔' + this.formData.year + '〕' + this.formData.mark + '号'
							this.formData.title = '太原市杏花岭区疾病预防控制中心文件'
						}else{
							// 发函
							this.formData.documentNumber = '杏疾控函〔' + this.formData.year + '〕' + this.formData.mark + '号'
							this.formData.title = '太原市杏花岭区疾病预防控制中心'
						}
						
						let {createDate,...objs} = this.formData
						console.log(objs)
						let info = await createOaSendDocuments(objs);
						console.log(info)
						uni.hideLoading()
						uni.showToast({
							title:'发起成功',
							icon:'none',
							success: () => {
								setTimeout(()=>{
									uni.redirectTo({
										url:'/pages/process/sendDocuments/index'
									})
								},1500)
							}
						})
					}catch(err){
						console.log(err)
						uni.hideLoading()
					}
				}).catch(err => {
					uni.hideLoading()
					console.log('表单错误信息：', err);
				})
			},
			inputOver(e) {
				this.formData.content = e.html
			},
			createDateChange(e){
				let date = uni.$u.timeFormat(e, 'yyyy年mm月dd日')
				this.formData.stalker = '太原市杏花岭区疾病预防控制中心   ' + date + '印发'
			},
			async typeChange(val){
				this.formData.type = val
				this.formData.oaApplicationNumberId = '';
				this.formData.mark = ''
				// let info = await getDocumentNumber({
				// 	year:this.formData.year,
				// 	type:this.formData.type
				// })
				// this.formData.mark = info.data
			},
			// async yearChange(val){
			// 	let info = await getDocumentNumber({
			// 		year:val,
			// 		type:this.formData.type
			// 	})
			// 	this.formData.mark = info.data
			// },
			// 选择文号
			async selectWenHao(){
				// 获取文号列表
				// getWenHaoList
				let list = await getOaApplicationNumberList({
					type:this.formData.type,
					deptId: this.$store.state.user.oaUser.deptId
				});
				console.log(list)
				this.wenHaoList = list.data;
				this.show = true;
			},
			// 点击文号列表选择
			clickBtn(data){
				console.log(data)
				this.formData.mark = data.num;
				this.formData.oaApplicationNumberId = data.id;
				this.show = false
			},
			close(){
				this.show = false
			}
		},
		
		async onLoad() {
			const currentDate = new Date();
			const currentYear = currentDate.getFullYear();
			this.formData.year = currentYear
			let info = await getDocumentNumber({
				year:this.formData.year,
				type:this.formData.type
			})
			this.formData.mark = info.data
		},
		async mounted() {
			// this.oaLeaveType = await getIntDictOptions('oa_leave');
			// console.log(this.oaLeaveType)
		}
	}
</script>

<style lang="less" scoped>
.create{
	width: 100%;
	height: auto;
	padding-top: 20rpx;
	.formsBox{
		width: 100%;
		height: auto;
		background-color: #fff;
		padding: 20rpx;
		box-sizing: border-box;
		.uni-forms-item{
			margin-bottom: 30rpx;
		}
	}
	.buttonBox{
		width: 100%;
		height: auto;
		padding: 0 20rpx;
		box-sizing: border-box;
		margin-top: 40rpx;
	}
	.lineCon{
		width: 100%;
		padding: 20rpx;
		box-sizing: border-box;
	}
	.itemLine{
		width: 100%;
		height: auto;
		border-bottom: 1rpx solid #ddd;
		box-sizing: border-box;
		background-color: rgba(255, 255, 255,0.6);
		display: flex;
		align-items: center;
		padding: 20rpx 30rpx;
		box-sizing: border-box;
		.icon{
			flex: none;
		}
		.info{
			flex: 1;
			margin-left: 20rpx;
			.titles{
				font-size: 30rpx;
				color: #333;
				font-weight: bold;
			}
			.yy{
				font-size: 26rpx;
				color: #333;
				margin-top: 10rpx;
				display: flex;
				align-items: center;
				.tip{
					margin-right: 20rpx;
				}
			}
		}
		.status{
			height: 100%;
			flex: none;
			display: flex;
			align-items: center;
			justify-content: center;
		}
	}
	.viewBox{
		height: 100%;
		display: flex;
		align-items: center;
	}
}
</style>
